<template>
	<view class="content">
		<view class="sch-head">
			<input v-model="cont" placeholder="搜索人才" />
			<image src="../../static/search.png" mode=""></image>
			<button  v-if="cont!==''">搜索</button>
			<view v-else></view>
		</view>
		<view class="navtab-head">
			<view class="navtab-box">
				<view :class="navIndex == 0?'nav-box' : ''" @click="navClick(0)">
					<view style="margin-right: 40upx;">最新</view>
					<view class="bottom-line"></view>
				</view>
				<view :class="navIndex == 1?'nav-box' : ''" @click="navClick(1)">
					<!-- <view class="nav-tit">推荐</view> -->
					<view class="bottom-line"></view>
				</view>
			</view>
			<view class="right-box">
				<view class="hy-box">
					<view class="hy-tit">行业(X)</view>
					<image src="../../static/hy-right.png"></image>
				</view>
				<view class="hy-box">
					<view class="hy-tit">职位(X)</view>
					<image src="../../static/hy-right.png"></image>
				</view>
				<view class="hy-box">
					<view class="hy-tit">区域(X)</view>
					<image src="../../static/hy-right.png"></image>
				</view>
			</view>
		</view>
		<view class="swiper-box" v-if="navIndex==0">
			<view class="item-box" v-for="item,i in list" :key="i">
				<view class="mid-line"></view>
				<view class="item-box-box" @click="zrcJianli(item.id)">
					<image :src="item.head_img" mode=""></image>
					<view class="item-box-center">
						<view class="item-header">
							<view class="name-tit">{{ item.name }}</view>
							<view class="gz-tit">{{ item.exp.exp_salary_type_name }}</view>
						</view>
						<view class="zaizhao-tit" style="margin-top: 15upx;">{{ item.exp.city_name }} | {{ item.edu_type_name }}</view>
						<view class="zhiwei-tit" style="margin: 10upx 0;" v-if="item.job_in_year == 0">工作年限：应届生</view>
						<view class="zhiwei-tit" style="margin: 10upx 0;" v-else>工作年限：{{ item.job_in_year }}年</view>
						<view class="zhiwei-tit" v-if="item.exp.exp_job">职位：{{ item.exp.exp_job }}</view>
						<view class="zhiwei-tit" v-else>职位：暂未填写</view>
					</view>
				</view>
			</view>
		</view>
		<view class="swiper-box" v-if="navIndex==1">
			
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				id:'',
				page:1,
				cont:'',
				list:[],
				navIndex:0
			}
		},
		onLoad() {
			this.getData(this.page)
		},
		onReachBottom(){
			this.page = this.page+1
			this.getData(this.page)
		},
		methods: {
			navClick(i){
				this.navIndex = i
				this.getData(this.page)
			},
			async getData(page) {
				const res = await this.get('/Index/Index/get_user_resume_list', {'page':this.page})
				if(res.data == false){
					uni.showToast({
						title:"暂无更多内容",
						duration: 1000,
						icon: 'none'
					})
				}else{
					console.log(res.data);
					for(var i in res.data){
						this.list.push(res.data[i]);
					}
				}
			},
			zrcJianli(id){
				uni.navigateTo({
					url:'./get_talent_item?id='+id
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.content{
		.sch-head{
			display: flex;
			align-items: center;
			width: 100%;
			padding: 30upx;
			background: #FFFFFF;
			box-shadow: 0 4upx 10upx 0 rgba(0, 0, 0, 0.2);
			position: fixed;
			z-index: 1;
			input{
				width: 100%;
				height: 80upx;
				color: #505559;
				font-size: 28upx;
				background: #EBEBEC;
				padding-left: 80upx;
				border-radius: 20upx;
				position: relative;
			}
			image{
				width: 45upx;
				height: 45upx;
				position: absolute;
				left: 50upx;
				top: 50upx;
			}
			button{
				width: 120upx;
				height: 72upx;
				color: #FFFFFF;
				font-size: 28upx;
				background: #3291F8;
				border-radius: 15upx;
				position: absolute;
				right: 35upx;
				top: 40upx;
			}
		}
		.navtab-head{
			display: flex;
			justify-content: space-between;
			padding-top: 140upx;
			.navtab-box{
				display: flex;
				font-size: 30upx;
				margin: 28upx 0 0 38upx;
				.nav-box{
					font-weight: bold;
					.bottom-line{
						width: 40upx;
						margin: 8upx 0 0 10upx;
						border-bottom: 4upx solid #3291F8;
					}
				}
			}
			.right-box{
				display: flex;
				margin: 28upx 26upx 0 0 ;
				.hy-box{
					display: flex;
					.hy-tit{
						color: #7B7B7B;
						margin: 0 0 16upx 34upx;
					}
					image{
						width: 28upx;
						height: 28upx;
						margin: 6upx 0 0 6upx;
					}
				}
			}
		}
		.swiper-box{
			.item-box{
				.mid-line{
					height: 20upx;
					background: #F6F6F6;
				}
				.item-box-box{
					display: flex;
					align-items: center;
					height: 264upx;
					border-radius: 10upx;
					image{
						width: 148upx;
						height: 148upx;
						margin: 0 30upx;
						border-radius: 50%;
					}
					.item-box-center{
						.item-header{
							display: flex;
							justify-content: space-between;
							width: 515upx;
							.name-tit{
								color: #101010;
								font-size: 32upx;
								font-weight: bold;
							}
							.gz-tit{
								color: #3291F8;
								font-size: 32upx;
								font-weight: bold;
							}
						}
						.zhiwei-tit{
							color: #7B7B7B;
							font-size: 26upx;
						}
						.zaizhao-tit{
							color: #7B7B7B;
							font-size: 26upx;
						}
					}
				}
			}
		}
	}
</style>
